<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="application/javascript"></script>
    <script type="application/javascript">
        /**
         * 登录方法
         */
        function ssoLogin(){
            // 首先需要带client_id,redirectUri回调地址 验证方式
            const clientId = "yudao-sso-demo-by-code1";
            const redirectUri = encodeURIComponent('http://127.0.0.1:19090/callback.html');
            const responseType = 'code'; // 授权码模式
            window.location.href = "http://127.0.0.1:80/sso?client_id=" + clientId + '&redirect_uri=' + redirectUri
                + '&response_type=' + responseType;
        }

        /**
         * 退出登录
         */
        function logout(){
            // 1、获取 token 信息
            const accessToken = localStorage.getItem("ACCESS-TOKEN");
            if(!accessToken){
                location.reload();
                return;
            }
            $.ajax({
                url:"http://127.0.0.1:19090/auth/logout",
                method:'POST',
                headers:{
                    'Authorization': 'Bearer ' + accessToken
                },
                success:function (result) {
                    if(result.code !== 0){
                        alert('退出登录失败，原因：' + result.msg)
                        return;
                    }
                    alert('退出登录成功');
                    // 删除localStorage中
                    localStorage.removeItem("ACCESS-TOKEN");
                    localStorage.removeItem("REFRESH-TOKEN");

                    location.reload();
                }

            })
        }

        /**
         * 更新用户昵称
         */
        function updateNickname(){
            // 1、先获取accessToken信息
            const accessToken = localStorage.getItem("ACCESS-TOKEN");
            if (!accessToken){
                return;
            }
            // 2、填写新的数据
            const nickname = prompt("请输入新的昵称", "");
            if (!nickname) {
                return;
            }
            // 3、发送请求
            $.ajax({
                url: "http://127.0.0.1:19090/user/update?nickname=" + nickname,
                method:'PUT',
                headers:{
                    'Authorization': 'Bearer ' + accessToken
                },
                success:function (resp){
                    if (resp.code !== 0){
                        alert("更新用户名称失败  原因" + resp.msg)
                        return;
                    }
                    $('#nicknameSpan').html(nickname)
                }
            })
        }

        function refreshToken(){
            // 1、获取刷新token
            const refreshToken = localStorage.getItem("REFRESH-TOKEN");
            if(!refreshToken){
                return;
            }

            // 2、发送请求
            $.ajax({
                url:"http://127.0.0.1:19090/auth/refresh-token?refreshToken=" + refreshToken,
                method:'POST',
                success:function (resp){
                    if(resp.code !== 0){
                        alert("刷新token失败")
                        return;
                    }
                    $('#accessTokenSpan').html(resp.data.access_token);
                    localStorage.setItem("ACCESS-TOKEN",resp.data.access_token);
                    localStorage.setItem("REFRESH-TOKEN",resp.data.refresh_token);
                }
            })
        }

        $(function (){
            // 1、先去获取本地存储的数据信息
            const accessToken = localStorage.getItem("ACCESS-TOKEN");
            if(!accessToken){
                $('#noLoginDiv').css('display','block')
                return;
            }
            // 登录成功

            $('#yesLoginDiv').css('display','block')
            $('#accessTokenSpan').html(accessToken);
            // 发送请求获取用户的信息
            $.ajax({
                url: "http://127.0.0.1:19090/user/get",
                method: 'GET',
                headers: {
                    'Authorization': 'Bearer ' + accessToken
                },
                success:function (resp){
                    if (resp.code !== 0){
                        alert("获取用户信息失败，原因" + resp.msg)
                        return;
                    }
                    $('#nicknameSpan').html(resp.data.nickname)

                }
            })

        })
    </script>

</head>
<body>
<!--情况1:未登录，跳转到ruoyi-vue-pro的SSO登录页-->
<div id="noLoginDiv" style="display: none">
    您未登录，点击<a href="#" onclick="ssoLogin()">跳转</a>sso登录
</div>
<!--情况二-->
<div id="yesLoginDiv" style="display: none">
    您已经登录! <button onclick="logout()">退出登录</button><br>
    昵称：<span id="nicknameSpan"> 加载中... </span> <button onclick="updateNickname()">修改昵称</button> <br />
    访问令牌：<span id="accessTokenSpan"> 加载中... </span> <button onclick="refreshToken()">刷新令牌</button> <br />
</div>
</body>
<style>
    body{
        border-radius: 20px;
        height: 350px;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
    }
</style>
</html>